<template>
	<div id="app" ref="app">
		<div class="contentAllBox">
			<keep-alive>
				<router-view v-if="$route.meta.keepAlive"></router-view>
			</keep-alive>
			<router-view v-if="!$route.meta.keepAlive"></router-view>
		</div>
		<img src="@/assets/img/offline.png" alt="" style="display:none;">
	</div>
</template>
<script>

export default {
  data() {
    return {
		 headerH:0,
		 footerH:0
    };
	},
  mounted() {
		setTimeout(()=>{
			this.setBarStyle();
		},300)
	},
	watch:{
		$route(to,from){
			this.setBarStyle();
		}
	},
  methods: {
    // 设置APP顶部状态栏沉浸式样式
		setBarStyle() {
			if (window.api!=undefined) {
				let routeNameArr=['index','goodsDetail','login','signIn','myAuthentication']
        if (api.systemType == 'android') {
					if (routeNameArr.indexOf(this.$route.name)>-1) {
						api.setStatusBarStyle({
							style: '#fff',
							color: 'transparent',
						});
					} else {
            api.setStatusBarStyle({
							style: 'dark',
							color: 'transparent',
						});
					}
				} else if(api.systemType == 'ios') {
					if (routeNameArr.indexOf(this.$route.name)>-1) {
						api.setStatusBarStyle({
							style: 'light',
							animated:true
						});
					} else {
            api.setStatusBarStyle({
							style: 'dark',
							animated:true
						});
					}
				}
			}
		},

		// 获取沉浸式头部和底部占用的像素距离
		setSafeArea() {
			if (window.api!=undefined) {
        this.headerH = api.safeArea.top-1;
				this.footerH= api.safeArea.bottom;
			}
		},

		
  }
};
</script>

<style type ="text/css" >

</style>



